<template>
	<div>
		<h5 class="lhh40 pl10 fs14 c333  clearfix pl10 pr10 bg_agray" @click="showAddress = true">
			<span class="fl">共<i class="c_main">{{truckDealerInfo.length}}</i>家经销商</span>
			<span class="fr c_main">{{address}}</span>	
		</h5>
		<div class="bg_white">	
			<template v-if="truckDealerInfo.length > 0">				
				<businessItem v-for="(item, index) in truckDealerInfo" :info="item" :key="index"></businessItem>
			</template>		
			<div v-else class="textc pb10 pt10"> 
				<img src="../../images/nodata.png">
				<div class="c_999 mt15">当地暂无经销商</div>
				<div class="mt10  c_main" @click="showAddress = true">切换地区</div>
			</div>
		</div>
		 <x-address style="display:none;" popup-title="请选择城市" title="456" v-model="city_name" :list="addressData" placeholder="请选择地址" :show.sync="showAddress"  hide-district @on-hide="select"></x-address>
		<div style="height:2.13333rem;"></div>
		<scrollTop></scrollTop>
	</div>
</template>

<script>
	import businessItem from '../../base/businessItem.vue'
	import {mapActions, mapGetters} from 'vuex'
	import { XAddress, ChinaAddressV4Data,Value2nameFilter as value2name } from 'vux'
	import scrollTop from '../../base/scrollTop.vue'
	export default {
		components:{
			businessItem,
			XAddress,
			scrollTop
		},
		computed:{
			...mapGetters('detail',[
				'truckDealerInfo'
			])
		},
		data () {
			return {
				addressData:ChinaAddressV4Data,
				city_name:[],
				showAddress:false,
				address:'江苏省 无锡市'
			}
		},
		methods:{
			...mapActions('detail',[
				'getTruckDealerInfo'
			]),
			select (value) {
				console.log(this.city_name);
				this.address = value2name(this.city_name, ChinaAddressV4Data) 
				var city_name = this.address.split(' ')[1].indexOf('市辖区') > -1 ? this.address.split(' ')[0]: this.address.split(' ')[1];
				this.getTruckDealerInfo({truckid:this.truck_info_id,city_name:city_name});
			}
		},
		mounted(){
			this.truck_info_id = this.$route.query.id;
			this.getTruckDealerInfo({truckid:this.truck_info_id,city_name:'无锡'});
		}
	}
</script>

<style lang = 'scss' scoped>
	
</style>